<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      // 第一题：
      // var fullName = 'language'
      // var obj = {
      // fullName: 'javascript',
      // prop: {
      //   getFullName: function () {
      //     console.log(this);
      //     return this.fullName
      //     // 1.function函数，看调用者
      //   }
      // }
      // }
      // console.log(obj.prop.getFullName())
      // //调用者：prop,prop中没有定义getFullName
      // var test = obj.prop.getFullName
      // console.log(test())
      // //调用者：window  //language

      //No.2
      // var val = 1
      // var json = {
      //   val: 10,
      //   dbl: function () {
      //     // this指向json
      //     // 没有this，不看调用着
      //     // 看作用域：dbl函数内没有val，向上找，找到window的val =1
      //     val *= 2  // val = 1*2 =2
      //   }
      // }
      // json.dbl()
      // // 调用者：json
      // console.log(json.val + val) //10+2 =12

      // No.3
      // var val = 1;
      // var json = {
      //   val: 10,
      //   dbl: function () {
      //     // this指向json
      //     // this.val = 10
      //     this.val *= 2; // 10*2 =20
      //   },
      // };
      // json.dbl(); //调用者：json
      // console.log(json.val + val);  //21
      // // josn.val + window.val = 20+1 =21

      // function () {}

      // No.4
      // var num = 10
      // var obj = {num: 20}
      // // 立即执行函数，只执行一次，调用着为window
      // obj.fn = (function (num) { //
      //   this.num = num * 3  // 全局num = 20*3 = 60
      //   num++ // 20++=21
      //   return function (n) { // 5  //10
      //     this.num += n // 全局num:60 + 5 =65  //obj.num:20 + 10 =30
      //     num++ //  21++ =22 //22++ = 23
      //     console.log(num) //22 //23
      //   }
      // })(obj.num)
      // var fn = obj.fn

      // fn(5)  //22
      // // 调用者 window
      // obj.fn(10) //23
      // console.log(num, obj.num) //65,30
      // // window.num = 65 ,obj.num = 30

      // No.5
      var name = "window";
      var person1 = {
        name: "person1",
        show1: function () {
          console.log(this.name);
        },
        show2: () => console.log(this.name),
        show3: function () {
          return function () {
            console.log(this.name);
          };
        },

        // console.log(person1.show3()); // return后的函数 funtion(){console.log(this.name)}

        show4: function () {
          // console.log(this);
          return () => console.log(this.name);
        },
      };

      var person2 = {
        name: "person2",
      };

      person1.show1(); //person1  //调用着：person1，
      person1.show1.call(person2); //person2  //调用者：person2，
      person1.show2(); // window  //箭头函数，看作用域：window
      person1.show2.call(person2); // window  //箭头函数，看作用域：window

      person1.show3()(); //window    // window.function（）()
      person1.show3().call(person2); //person2   //调用者p2,
      person1.show3.call(person2)(); //window   //return 后函数 的调用者是window

      console.log(person1.show4());

      person1.show4()(); //person1   //箭头函数，定义作用域是show4，show4的指向是person1
      person1.show4().call(person2); //person1  //箭头函数，不看调用者，看作用域，同上
      person1.show4.call(person2)(); //person2  //function函数，调用者指向person2,返回的箭头函数看作用域，同上
    </script>
  </body>
</html>
